<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>帝国CMS-图集显示插件</title>
<style type=text/css>
<!--
{ font-family: 宋体; font-size: 12px; line-height: 19px; color: #333333;text-decoration: none} a:hover { color: #FF0000}a:hover { text-decoration: none}a:hover { line-height: 19px}a:link { font-family: 宋体; font-size: 14px; line-height: 19px; color: #333333;text-decoration: none} a:visited { text-decoration: none; }Table{ font-family: 宋体; font-size: 13px; color: #000000; line-height: 21px; text-decoration: none } }
.box {border: 1px solid #333333;height: 10px;width: 10px;font-size:1px;cursor:hand;filter:blur(add=ture,direction=135,strength=2);}
.STYLE1 {color: #666666}
-->
</Style>
</head>

<body>
<table width="800" border="0" align="center" cellpadding="3" cellspacing="1" bgcolor="#4FB4DE">
  <tr>
    <td height="38"><div align="center"><strong><font color="#FFFFFF" size="4">帝国CMS - 图集显示插件使用说明</font></strong></div></td>
  </tr>
  
  <tr> 
    <td height="30" bgcolor="#FFFFFF"> <div align="center"><a href="http://www.phome.net/OpenSource/" target="_blank"><font color="#FF0000"><strong>帝国CMS － 稳定可靠、安全省心</strong></font></a></div></td>
  </tr>
  <tr> 
    <td height="23" bgcolor="#C9F1FF"><strong>一、显示效果：</strong></td>
  </tr>
  <tr> 
    <td height="30" bgcolor="#FFFFFF"> <table width="99%" border="0" align="center" cellpadding="1" cellspacing="1">
        <tr> 
          <td height="23"><div align="center"><img src="doc/demopic.jpg" width="600" height="600"></div></td>
        </tr>
      </table>
      <br></td>
  </tr>
  <tr> 
    <td height="23" bgcolor="#C9F1FF"><strong>二、使用语法说明</strong></td>
  </tr>
  <tr> 
    <td height="30" bgcolor="#FFFFFF"> <table width="99%" border="0" align="center" cellpadding="1" cellspacing="1">
        <tr> 
          <td height="25"><strong><font color="#0000FF">(一)、【显示图集函数语法说明】</font></strong></td>
        </tr>
        <tr> 
          <td height="25"><strong>1、格式：</strong></td>
        </tr>
        <tr> 
          <td height="25"><input name="textarea" type="text" style="WIDTH:100%" value="sys_ModShowMorepic(导航小图宽度,导航小图高度,小图导航模板内容)" size="60"></td>
        </tr>
        <tr>
          <td height="25"><font color="#666666">(其中“小图导航模板内容”参数可以不设置。)</font></td>
        </tr>
        
        <tr> 
          <td height="25"><strong>2、使用范例1：</strong></td>
        </tr>
        <tr> 
          <td height="25"><textarea name="textarea2" cols="80" rows="2" wrap="off" style="WIDTH:100%">&lt;?=sys_ModShowMorepic(120,80,'')?&gt;</textarea></td>
        </tr>
        <tr> 
          <td height="25"><strong>3、使用范例2：</strong>(指定小图导航模板)</td>
        </tr>
        <tr> 
          <td height="25"><textarea name="textarea3" cols="80" rows="5" wrap="off" style="WIDTH:100%">&lt;?php
$morepicdhtemp='&lt;table&gt;&lt;tr&gt;[!--empirenews.listtemp--]&lt;td bgcolor=&quot;#cccccc&quot; align=&quot;center&quot; id=&quot;espicid[!--page--]&quot;[!--thiscss--]&gt;&lt;a href=&quot;#empirecms&quot; onclick=&quot;ecmsShowPic([!--page--]);&quot;&gt;&lt;img src=&quot;[!--spicurl--]&quot; width=&quot;[!--spicwidth--]&quot; height=&quot;[!--spicheight--]&quot; border=&quot;0&quot;&gt;&lt;/a&gt;&lt;br&gt;[!--spicno--]&lt;/td&gt;[!--empirenews.listtemp--]&lt;/tr&gt;&lt;/table&gt;';
sys_ModShowMorepic(120,80,$morepicdhtemp);
?&gt;</textarea></td>
        </tr>
        <tr> 
          <td height="25">&nbsp;</td>
        </tr>
        <tr> 
          <td height="25"><strong><font color="#0000FF">(二)、【显示内容的层ID说明】</font></strong></td>
        </tr>
        <tr>
          <td height="25"><strong>1、显示内容层ID名称列表：</strong></td>
        </tr>
        <tr>
          <td height="25"><p>            (1)、显示小图导航：ecmssmallpicsid<br>
            (2)、显示下拉分页导航：ecmsselectpagesid<br>
            (3)、显示列表分页导航：ecmslistpagesid</p>
            <p>(4)、表单ID：eViewPicForm<br>
              (5)、当前分页号：ethispage<br>
              (6)、是否自动播放：autoplaystop<br>
              (7)、自动播放秒数：autoplaysec<br>
              (8)、大图显示：ecmsbigpicid<br>
              (9)、小图显示：ecmssmallpicid<br>
          (10)、图片说明：ecmspicnameid</p></td>
        </tr>
        <tr>
          <td height="25"><strong>2、例子：</strong>显示小图导航位置 </td>
        </tr>
        <tr>
          <td height="25">
          <textarea name="textarea4" cols="80" rows="2" wrap="off" style="WIDTH:100%">&lt;div id=&quot;ecmssmallpicsid&quot;&gt;&lt;/div&gt;</textarea></td>
        </tr>
        <tr>
          <td height="25">&nbsp;</td>
        </tr>
        <tr>
          <td height="25"><strong><font color="#0000FF">(三)、【小图导航模板变量说明】</font></strong></td>
        </tr>
        <tr>
          <td height="25"><strong>1、模板制作格式：</strong></td>
        </tr>
        <tr>
          <td height="25">列表头[!--empirenews.listtemp--]列表内容[!--empirenews.listtemp--]列表尾</td>
        </tr>
        <tr>
          <td height="25"><strong>2、变量说明：</strong></td>
        </tr>
        <tr>
          <td height="25">(1)、[!--page--]：图片页码<br>
            (2)、[!--thiscss--]：当前图的CSS样式<br>
            (3)、[!--spicurl--]：小图图片地址<br>
            (4)、[!--spicwidth--]：图片宽度<br>
            (5)、[!--spicheight--]：图片高度<br>
          (6)、[!--spicno--]：当前图片编号</td>
        </tr>
        <tr>
          <td height="25"><strong>3、模板范例：</strong></td>
        </tr>
        <tr>
          <td height="25"><textarea name="textarea5" cols="80" rows="2" wrap="off" style="WIDTH:100%">&lt;table&gt;&lt;tr&gt;[!--empirenews.listtemp--]&lt;td bgcolor=&quot;#cccccc&quot; align=&quot;center&quot; id=&quot;espicid[!--page--]&quot;[!--thiscss--]&gt;&lt;a href=&quot;#empirecms&quot; onclick=&quot;ecmsShowPic([!--page--]);&quot;&gt;&lt;img src=&quot;[!--spicurl--]&quot; width=&quot;[!--spicwidth--]&quot; height=&quot;[!--spicheight--]&quot; border=&quot;0&quot;&gt;&lt;/a&gt;&lt;br&gt;[!--spicno--]&lt;/td&gt;[!--empirenews.listtemp--]&lt;/tr&gt;&lt;/table&gt;</textarea></td>
        </tr>
        <tr>
          <td height="25">&nbsp;</td>
        </tr>
        <tr>
          <td height="25"><strong><font color="#0000FF">(四)、【CSS定义说明】</font></strong></td>
        </tr>
        <tr>
          <td height="25"><strong>1、CSS名称说明：</strong></td>
        </tr>
        <tr>
          <td height="25">(1)、小图导航(当前图样式)css名称：espiccss</td>
        </tr>
        <tr>
          <td height="25">(2)、列表分页导航(当前分页样式)css名称：epiclpcss</td>
        </tr>
        <tr>
          <td height="25">(3)、大图显示css名称：eimgBox</td>
        </tr>
        <tr>
          <td height="25"><strong>2、使用范例：</strong></td>
        </tr>
        <tr>
          <td height="25"><textarea name="textarea6" cols="80" rows="12" wrap="off" style="WIDTH:100%">&lt;style&gt;

/* 小图导航(当前图样式) */
.espiccss{background-color:#666666;color:#ffffff;}

/* 列表分页导航(当前分页样式) */
.epiclpcss{font-weight:bold;}

/* 大图显示 */
.eimgBox{
	position: relative;
	float:left;
}
.eimgBox div{
	position:absolute;
	left:0px;
	top:0px;
	width:50%;
	height:98%;
	background: #fff;
	opacity:0.0;
	filter:alpha(opacity=0);
}
.eimgBox .eimgboxleft{
	cursor: pointer;
}
.eimgBox .eimgboxright{
	left:50%;
	cursor: pointer;
}

&lt;/style&gt;</textarea></td>
        </tr>
        
        <tr>
          <td height="25">&nbsp;</td>
        </tr>
        <tr>
          <td height="25"><strong><font color="#0000FF">(五)、【其它说明】</font></strong></td>
        </tr>
        <tr>
          <td height="25">1、支持键盘方向键切换图片。<br>
          2、点击图片左右两边切换上下张图片。</td>
        </tr>
        <tr>
          <td height="25">&nbsp;</td>
        </tr>
      </table></td>
  </tr>
  <tr>
    <td><strong><font color="#FFFFFF">三、完整范例</font></strong></td>
  </tr>
  <tr>
    <td bgcolor="#FFFFFF"><table width="99%" border="0" align="center" cellpadding="3" cellspacing="1">
      <tr>
        <td><strong>内容模板使用图集显示插件完整范例：</strong>可参考本目录下的“<a href="example.html" target="_blank">example.html</a>”文件html源代码。</td>
        </tr>
    </table></td>
  </tr>
  <tr> 
    <td>&nbsp;</td>
  </tr>
</table>
<hr>
<table width="100%" border="0" cellspacing="1" cellpadding="1">
  <tr>
    <td height="25">
<div align="center"><a href="http://www.phome.net" target="_blank">官方网站</a> | 
        <a href="http://bbs.phome.net" target="_blank">论坛交流</a> | <a href="http://www.phome.net/product/" target="_blank">产品中心</a> 
        | <a href="http://www.phome.net/download/" target="_blank">产品下载中心</a></div></td>
  </tr>
</table>
</body>
</html>
